<template>
  <router-view></router-view>
</template>

<script lang="ts">
import { ref,  provide } from 'vue'
import {router} from './router'
export default {
  name: 'App',
  // 声明一个menuVisible，控制侧边栏顶部按钮显示与隐藏
  setup(){
    const width = document.documentElement.clientWidth
    const menuVisible = ref(width<=500?false:true) // 默认看不见
    provide('menuVisible', menuVisible) // 想要使用menuVisible，自己需要提供xxx名字就行了

    router.afterEach(()=>{
      if(width<=500){
        menuVisible.value = false
      }
    })
  }
}
</script>
